
<html>
<head>
<link type="text/css" href="css/ui-lightness/jquery-ui-1.8.10.custom.css" rel="stylesheet" />	
<script type="text/javascript" src="js/jquery-1.4.4.min.js"></script>
<script type="text/javascript" src="js/jquery-ui-1.8.10.custom.min.js"></script>
<style type="text/css">
	body{ font: 62.5% "Trebuchet MS", sans-serif; margin: 50px;}
	h2{ margin-top: 2em; }
	#dialog_link {padding: .4em 1em .4em 20px;text-decoration: none;position: relative;}
	#dialog_link span.ui-icon {margin: 0 5px 0 0;position: absolute;left: .2em;top: 50%;margin-top: -8px;}
	ul#icons {margin: 0; padding: 0;}
	ul#icons li {margin: 2px; position: relative; padding: 4px 0; cursor: pointer; float: left;  list-style: none;}
	ul#icons span.ui-icon {float: left; margin: 0 4px;}
</style>	
<script type="text/javascript">
	var afficherTousSprint = function() {
		   $.ajax({
			   type: 'GET',
			   url: '/rest/sprint/json',
			   success: function(data) {
				   $.each(data, function(index, sprint) { 
				   		$.get(sprint.url, function(data) {
							$('.allSprint').append(data);
						 });
					 });
					$("#accordion").accordion({ header: "h3" });
			   },
			   contentType: 'application/json',
			 });
	};
 	$(document).ready(function() {
		afficherTousSprint();
 	   var sprint = {id : '', stories:[]};
	   var onSucess = function(data) {
		   $('.result').load(data, function() {
				$("#accordion").accordion({ header: "h3" });
			});
		 };
	   $("#ajouterStory").click(function() {
		   var story = {projet : $('#storyProjet').val(),
						estimation : $('#storyEstimation').val(),
						nom : $('#storyNom').val()
		   };
		   sprint.stories.push(story);
	   });
	   $("#ajouterSprint").click(function() {
		   sprint.id = $('#sprintId').val();
		   $.ajax({
			   type: 'POST',
			   url: '/rest/sprint',
			   data: JSON.stringify(sprint),
			   success: onSucess,
			   contentType: 'application/json',
			 });
	   });
	   $("#ajouterStory").click(function() {
		   sprint.id = $('#sprintId').val();
		   $.ajax({
			   type: 'POST',
			   url: '/rest/sprint',
			   data: JSON.stringify(sprint),
			   success: onSucess,
			   contentType: 'application/json',
			 });
	   });
	 });                                 
 </script>
</head>
<body>
<img src="http://chart.apis.google.com/chart?chs=440x220&cht=lc&chco=3072F3,FF0000&chds=0,16&chd=t:15,14,13,12,11,10,9,8,7,6,5,4,3,2,1|15,15,13,12,9,8,8,7,6,4,4,3,2,1&chdlp=b&chls=2,4,1|1&chma=5,5,5,25" width="440" height="220" alt="" />
<div class="allSprint"></div>
<div class="result"></div>
<form>
id : <input type="text" id="sprintId">
</form>
<form>
Projet : <input type="text" id="storyProjet"/>
Estimation : <input type="text" id="storyEstimation"/>
Nom : <input type="text" id="storyNom"/>
</form>
<div id="ajouterStory">Ajouter Story</div>
<div id="ajouterSprint">Ajouter Sprint</div>
</body>
</html>